import { types } from "mobx-state-tree";
import { values } from "mobx";
import { Todo } from './Todo';
import { getTodo } from '../lib/todoList';
export const randomId = () => Math.floor(Math.random() * 1000).toString(36);


const RootStore = types
  .model({
    todos: types.optional(types.map(Todo), {})
  })
  .views(self => ({
    get pendingCount() {
      return values(self.todos).filter((todo: any) => !todo.done).length;
    },
    get completedCount() {
      return values(self.todos).filter((todo: any) => todo.done).length;
    }
  }))
  .actions((self: any) => {
    function addTodo(id: string, name: string) {
      self.todos.set(id, Todo.create({ name }));
    }
    function runInAction(fn: () => any) {
      fn();
    }
    function setTodoList(todoList: Todos) {
      self.todos = todoList
    }
    async function getTodoList() {
      const data = await getTodo();
      console.log(data);

      self.runInAction(() => {
        self.todos = data;
      })
    }
    return { addTodo, setTodoList, runInAction, getTodoList };
  });

export const store = RootStore.create({
  todos: {},
});